<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html>
<head>
<base href='<%=basePath%>'>
<script src="res/js/jquery-2.1.4.min.js" type="text/javascript"></script>
<script src="res/js/echarts.js"></script>
<link rel="stylesheet" href="res/layui/css/layui.css">
<script src="res/layui/layui.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>分店商品销售情况</title>
</head>
<body>

<div id="main" style="width: 900px;height:500px;"></div>

<div class="layui-inline">
      <label class="layui-form-label">年月选择器</label>
      <div class="layui-input-inline">
        <input class="layui-input" id="test3" placeholder="yyyy-MM" type="text">
      </div>
    </div>
</body>

<script type="text/javascript">
var myChart = echarts.init(document.getElementById('main'));
	
	function test(){
		var test = $("#test6").val();
		alert(test);
	}
	
	var data =[];
	var data1 =[];
	var url = "money/selectWare.action";
	
	$.post(url,null,function(money){
		
		for(var i = 0; i < money.money.length; i++){
			data.push( money.money[i].num);
			data1.push(money.money[i].name);
		}
		
option = {
		 title : {
		        text: money.year+'年'+money.month+'月分店药品销量图',
		        x:'center'
		    },
    color: ['#3398DB'],
    tooltip : {
        trigger: 'axis',
        axisPointer : {            // 坐标轴指示器，坐标轴触发有效
            type : 'line'        // 默认为直线，可选为：'line' | 'shadow'
        }
    },
    grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',    
        containLabel: true
    },
    xAxis : [
        {
            type : 'category',
            data : data1,
            axisTick: {
                alignWithLabel: true
            }
        }
    ],
    yAxis : [
        {
            type : 'value'
        }
    ],
    series : [
        {
            name:'直接访问',
            type:'bar',
            barWidth: '60%',
            data:data
        }
    ]
};


		// 使用刚指定的配置项和数据显示图表。
		myChart.setOption(option);

	});
	      

</script>
<script type="text/javascript">

//加载日期格式
layui.use('laydate', function() {
	var laydate = layui.laydate;
	
	  //年月选择器
	  laydate.render({
	    elem: '#test3'
	    ,type: 'month'
	  });
});
</script>
</html>